// src/shared/loadable/index.tsx
import React from "react";
import { SpinLoading } from "antd-mobile";

const style: React.CSSProperties = {
    fontSize: "10vw",
    position: "absolute",
    left: "50%",
    top: "50%",
    transform: "translate(-50%, -50%)",
};

export default function loadable(
    Component: React.LazyExoticComponent<
        (props: any) => React.ReactElement | null
        >
) {
    return function (props: any) {
        return (
            <React.Suspense fallback={<SpinLoading style={style} />}>
                <Component {...props} />
            </React.Suspense>
        );
    };
}